<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>商品详情</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <base href="http://localhost/campus/">
    <link rel="shortcut icon" href="static/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" type="text/css" href="layui/css/layui.css"/>
    <link rel="stylesheet" type="text/css" href="static/css/main.css"/>
    <script src="static/js/jquery.min.js"></script>
    <script src="static/js/main.js"></script>
    <script src="layui/layui.js" charset="utf-8"></script>
</head>
<body>
<div class="layui-fluid">

    <jsp:include page="/pages/common/header.jsp"/>
    <%--主体内容--%>
    <div class="layui-row center">
        <div class="layui-col-xs2 layui-col-sm2 layui-col-md2">
            <div class=center_category style="background: #797979;">
                <ul class="layui-nav layui-nav-tree layui-inline" lay-shrink="all"
                    style="margin-right: 10px;background: #797979">
                    <c:forEach var="firstCategory" items="${categories}">
                        <li class="layui-nav-item ${clickCategory.id.equals("0") ? "layui-this":""}
                        ${clickCategory.parent !=null && clickCategory.parent.equals(firstCategory.id) ? "layui-nav-itemed" : ""}">
                            <a href="javascript:${firstCategory.children==null ? "menu_click(0)":""};"
                               style="background: #797979;">${firstCategory.title}</a>
                            <c:if test="${firstCategory.children!=null}">
                                <dl class="layui-nav-child">
                                    <c:forEach var="secondCategory" items="${firstCategory.children}">
                                        <dd class="${secondCategory.id.equals(clickCategory.id)?"layui-this":""}">
                                            <a style="background: #8F908E;"
                                               href="javascript:menu_click('${secondCategory.id}');">${secondCategory.title}</a>
                                        </dd>
                                    </c:forEach>
                                </dl>
                            </c:if>
                        </li>
                    </c:forEach>
                </ul>
            </div>
        </div>
        <div class="layui-col-xs10 layui-col-sm10 layui-col-md10">
            <div class=center_product id="center_body">
                <div class="product_nav" style="height: 5%;">
                    <div class="product_nav_breadcrumb">
                        当前路径：
                        <span class="layui-breadcrumb">
                            <a>${clickCategory.parentPojo.categoryName}</a>
                             <a>${clickCategory.categoryName}</a>
                            <a><cite>${product.name}</cite></a>
                        </span>
                    </div>
                </div>
                <div class="product_body" id="product_body" style="height: 90%">
                    <div class="product_detail_left">
                        <img alt="" src="${product.img}">
                        <div>
                            <button class="layui-btn ${product.releaseUserPojo.id.equals(sessionScope.user.id) || sessionScope.user == null ? "layui-btn-disabled":"layui-btn-warm"}"
                                    onclick="addFavorite('${product.releaseUserPojo.id.equals(sessionScope.user.id) || sessionScope.user == null ? "null":product.id}')">
                                加入收藏
                            </button>
                            <button class="layui-btn ${product.releaseUserPojo.id.equals(sessionScope.user.id)? "layui-btn-disabled":""}"
                                    style="margin-left: 14%;background: ${product.releaseUserPojo.id.equals(sessionScope.user.id)? "":"red"}"
                                    onclick="buy('${product.releaseUserPojo.id.equals(sessionScope.user.id) ? "null":product.id}')">
                                立即购买
                            </button>
                        </div>
                    </div>
                    <div class="product_detail_right">
                        <div class="product_detail_rt">
                            <div class="product_detail_nav">商品信息</div>
                            <p>${product.name}</p>
                            <div style="width: 95%;height: 12%">
                                <p style="float: left;color: #ff4136;">￥${product.price}</p>
                                <p style="float: right;color: #1E9FFF">${product.stringReleaseTime}</p>
                            </div>
                            <div class="product_detail_introduce">
                                ${product.productDescribe}
                            </div>
                        </div>
                        <div class="product_detail_rb">
                            <div class="product_detail_nav">卖家信息</div>
                            <div class="product_detail_releaseInfo">
                                <i class="layui-icon">&#xe66f;</i>
                                <label>昵称：<p>${product.releaseUserPojo.username}</p></label>
                            </div>
                            <div class="product_detail_releaseInfo">
                                <i class="layui-icon">&#xe612;</i>
                                <label>真实姓名：
                                    <p>${product.releaseUserPojo.realName == null ? "未填写":product.releaseUserPojo.realName}</p>
                                </label>
                            </div>
                            <div class="product_detail_releaseInfo">
                                <i class="layui-icon">&#xe678;</i>
                                <label>联系电话：<p>${product.releaseUserPojo.phone}</p></label>
                            </div>
                            <div class="product_detail_releaseInfo">
                                <i class="layui-icon">&#xe662;</i>
                                <label>性别：
                                    <p>${product.releaseUserPojo.sex == 2 ? "保密": product.releaseUserPojo.sex == 1 ? "女" : "男"}</p>
                                </label>
                            </div>
                            <div class="product_detail_releaseInfo">
                                <i class="layui-icon">&#xe68e;</i>
                                <label>地址：
                                    <p>${product.releaseUserPojo.address == null ? "未填写":product.releaseUserPojo.address}</p>
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <%@include file="/pages/common/footer.jsp" %>

</div>
<script>
    //注意：导航 依赖 element 模块，否则无法进行功能性操作
    var element = null;
    layui.use('element', function () {
        element = layui.element;

        //…
    });

    var layer = null;
    layui.use('layer', function () {
        layer = layui.layer;
    });

    //商品立即购买事件
    function buy(productId) {
        if (${sessionScope.user == null}) {
            layer.msg("请先登录");
            return false;
        }
        if (${sessionScope.user.realName==null || sessionScope.user.realName.equals("")}) {
            layer.msg("请先到个人中心进行实名再进行购买", {
                icon: 2
                , time: 2000
            });
            return false;
        }
        if (productId === "null")
            return false;
        window.location.href = "http://localhost/campus/order/confirm?productId=" + productId
    }

    //商品筛选事件
    function product_search() {
        let minPrice = $("#min_price").val();
        let maxPrice = $("#max_price").val();
        let releaseTimeRange = $("#releaseTime_range").val();

        if (minPrice !== "" && maxPrice !== "")
            if (!/^(([^0][0-9]+|0)\.([0-9]{1,2})$)|^(([^0][0-9]+|0)$)|^(([1-9]+)\.([0-9]{1,2})$)|^(([1-9]+)$)/.test(minPrice)
                || !/^(([^0][0-9]+|0)\.([0-9]{1,2})$)|^(([^0][0-9]+|0)$)|^(([1-9]+)\.([0-9]{1,2})$)|^(([1-9]+)$)/.test(maxPrice)) {
                layer.msg("请输入正确的价格", {
                    icon: 2,
                    time: 1000
                });
                return false;
            }

        if (releaseTimeRange !== "" && !/\d{4}-\d{2}-\d{2} - \d{4}-\d{2}-\d{2}/.test(releaseTimeRange)) {
            layer.msg("不是正确的日期范围", {
                icon: 2,
                time: 1000
            });
            return false;
        }

        minPrice = parseFloat(minPrice);
        maxPrice = parseFloat(maxPrice);

        sendJsonParam('${clickCategory.id}', 1, minPrice, maxPrice, null, releaseTimeRange);
    }

</script>
</body>
</html>
